.code-editor-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: #1e1e1e;
}

.code-editor-header {
  padding: 4px;
  background-color: #252526;
  border-bottom: 1px solid #333;
}

.code-editor-header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.file-info {
  color: #cccccc;
  font-size: 12px;
}

.save-button {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  background-color: #0e639c;
  color: white;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  font-size: 12px;
  transition: background-color 0.2s;
}

.save-button:hover {
  background-color: #1177bb;
}

.save-button:disabled {
  background-color: #2d2d2d;
  color: #666;
  cursor: not-allowed;
}

.code-editor-content {
  flex: 1;
  display: flex;
  overflow: hidden;
}

.file-tree-panel {
  background-color: #252526;
  height: 100%;
  overflow: hidden;
  min-width: 200px;
  display: flex;
  flex-direction: column;
}

.editor-panel {
  flex: 1;
  background-color: #1e1e1e;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Custom Tab Styles */
.editor-panel .ant-tabs {
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: #1e1e1e;
}

.editor-panel .ant-tabs-content {
  height: 100%;
  flex: 1;
}

.editor-panel .ant-tabs-tabpane {
  height: 100%;
}

.editor-panel .ant-tabs-nav {
  margin: 0 !important;
  background-color: #252526;
  border-bottom: 1px solid #333;
}

.editor-panel .ant-tabs-tab {
  background: #2d2d2d !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 4px 16px !important;
  color: #969696 !important;
  transition: background-color 0.2s, color 0.2s;
}

.editor-panel .ant-tabs-tab:not(:first-child) {
  border-left: 1px solid #333 !important;
}

.editor-panel .ant-tabs-tab:hover {
  background: #383838 !important;
  color: #ffffff !important;
}

.editor-panel .ant-tabs-tab-active {
  background: #1e1e1e !important;
  color: #ffffff !important;
}

.editor-panel .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: #ffffff !important;
}

.editor-panel .ant-tabs-tab-btn {
  color: #969696;
}

.editor-panel .ant-tabs-tab-remove {
  color: #666 !important;
  margin-left: 8px;
}

.editor-panel .ant-tabs-tab-remove:hover {
  color: #ff6b6b !important;
}

.editor-panel .ant-tabs-nav-add {
  background-color: #2d2d2d !important;
  border: none !important;
  color: #969696 !important;
  transition: background-color 0.2s, color 0.2s;
}

.editor-panel .ant-tabs-nav-add:hover {
  background-color: #383838 !important;
  color: #ffffff !important;
}

/* Split Gutter Style */
.gutter {
  background-color: #333;
}

.gutter:hover {
  background-color: #454545;
}

.gutter.gutter-horizontal {
  cursor: col-resize;
}

.gutter.gutter-vertical {
  cursor: row-resize;
}

/* Ensure split containers take full height */
.split {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
}

.split > div {
  height: 100% !important;
  overflow: hidden !important;
}

/* VSCode dark theme for context menu (dropdown) */
.vscode-dark-dropdown .ant-dropdown-menu {
  background-color: #252526 !important;
  border: 1px solid #3c3c3c !important;
  box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.48), 0 6px 16px 0 rgba(0, 0, 0, 0.32) !important;
  padding: 4px 0 !important;
}

.vscode-dark-dropdown .ant-dropdown-menu-item {
  color: #cccccc !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
}

.vscode-dark-dropdown .ant-dropdown-menu-item:hover {
  background-color: #04395e !important;
  color: #ffffff !important;
}

.vscode-dark-dropdown .ant-dropdown-menu-item .anticon {
  color: #cccccc !important;
  margin-right: 8px !important;
}

.vscode-dark-dropdown .ant-dropdown-menu-item:hover .anticon {
  color: #ffffff !important;
}

.vscode-dark-dropdown .ant-dropdown-menu-item-divider {
  background-color: #3c3c3c !important;
  margin: 4px 0 !important;
}
